 <!--
* description: 借件单号选择
* createdDate:
-->
<template>
  <el-dialog
    v-dialogDrag
    :title="topName"
    :visible="popupsVisible"
    :append-to-body="true"
    width="70%"
    center
    :close-on-click-modal="false"
    @close="closeEdit"
  >
    <dialogHeader
      slot="title"
      :title="topName"
      :style-type="$store.state.app.dialogType"
    />

    <one-table-template
      ref="multipleTable"
      :dynamic-api-config="apiConfig"
      :dynamic-buttons="tableButtons"
      :dynamic-components="tableComponents"
      :dynamic-table-cols="tableCols"
      :dynamic-form-fields="formField"
      :dynamic-table-defult-height="300"
      :dynamic-is-show-more-btn="false"
      :dynamic-is-show-select="false"
      :callback-obj="callbackObj"
    />
  </el-dialog>
</template>
<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import Vue from 'vue'
import api from "@/api/pa/apiBranchWarehouse";

export default {
  name: 'SalesStore',

  components: {
    OneTableTemplate,
    dialogHeader: () => import('@/components/dialogHeader') // 弹窗标题,
  },

  mixins: [oneTableWithViewTemplateMixins],

  props: {
    popupsVisible: { type: Boolean, default: false },
    code: { type: String, default: '' },
    comType: { type: String, default: '' },
    codeField: { type: String, default: '' },
    popupsKey: { type: String, default: '' },
    isMul: { type: Boolean, default: true },
    validrule: {
      type: Object,
      default: () => {}
    }
  },

  beforeRouteEnter(to, from, next) {
    Vue.prototype.$ConfigCache.CacheConfig.initData(
      // 同时加载当前页面和编辑框页面的配置
      [to.path, ''],
      function() {
        next()
      })
  },

  data() {
    const viewPageCode = this.$route.path

    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode])

    return {
      topName: '借件单号选择',

      // 网格查询API配置对象
      apiConfig: api.partsBorrowingReturning,

      // 动态组件-按钮
      tableButtons: this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
      this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons &&
      this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons.length > 0
        ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons
        : [
          {
            compKey: 'btnKey1',
            type: 'primary',
            size: 'small',
            name: 'search',
            clickEvent: () => this.queryTable(1),
            text: this.$t('sys.button.query'),
            position: 'right',
            fuzzySearch: true
          },
          {
            compKey: 'btnKey2',
            size: 'small',
            name: 'reset',
            clickEvent: this.reset,
            text: this.$t('sys.button.reset'),
            position: 'right'
          }
        ],

      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableComponents
          :  [
                    {
                      compKey: "compKey1",
                      labelName: "借件单号：",
                      codeField: "borrowCode",
                      component: () => import("@/components/org/commonInput"),
                      type: "inputText",
                      isMust: true,
                      span: 8,
                    },
                    {
                      compKey: "compKey2",
                      labelName: "仓库名称：",
                      codeField: "warehouseName",
                      textField: "warehouseName",
                      customObj: {
                        api: api.queryWareHouse,
                        defOptionFields: ["warehouseId", "warehouseName"],
                      },
                      component: () => import("@/components/org/commonSelect"),
                      type: "dropdownList",
                      isMust: true,
                      span: 8,
                    },
                    {
                      compKey: "compKey3",
                      labelName: "借件人员：",
                      codeField: "applierId",
                      component: () => import("@/components/org/commonInput"),
                      type: "inputText",
                      isMust: true,
                      span: 8,
                    },
                    {
                      compKey: "compKey4",
                      labelName: "联系电话：",
                      codeField: "linkPhone",
                      component: () => import("@/components/org/commonInput"),
                      type: "inputText",
                      isMust: true,
                      span: 8,


                    },

                    {
                      compKey: "compKey5",
                      labelName: "VIN：",
                      codeField: "vin",
                      component: () => import("@/components/org/commonInput"),
                      type: "inputText",
                      isMust: true,
                      span: 8,
                    },
                    {
                      compKey: "compKey6",
                      labelName: "借件日期：",
                      codeField: "applyDateStart,applyDateEnd",
                      component: () =>
                        import("@/components/org/datePicker/andtDatePicker"),
                      type: "YYYY-MM-DD HH:mm:ss",
                      hhmmss: true, //默认有时分秒
                      format: "yyyy-MM-dd",
                      isMust: true,
                      span: 8,
                    },
                  ],

      tableCols: this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
      this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableCols.length > 0
        ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableCols
        :[
                    {
                      prop: "borrowId",
                      label: "借件单号id",
                      hidden: true,
                    },
                    {
                      prop: "borrowCode",
                      label: "借件单号",
                    },
                    {
                      prop: "warehouseName",
                      label: "仓库名称",
                    },
                    {
                      prop: "auditorId",
                      label: "借件人员",
                    },
                    {
                      prop: "linkPhone",
                      label: "联系电话",
                    },
                    {
                      prop: "applyDate",
                      label: "借件日期",
                    },
                    {
                      prop: "vin",
                      label: "VIN",
                    },
                    {
                      prop: "borrowReason",
                      label: "借件原因",
                    },
                    {
                      prop: "partNum",
                      label: "借件品种数",
                    },
                    {
                      prop: "lumpSum",
                      label: "借件总金额",
                    },
                  ],

      formField: this.$utils.getFormField(this, {
        borrowCode: '',
        warehouseName:'',
        applierId: '',
        linkPhone:'',
        vin: '',
        applyDateStart:'',
        applyDateEnd: '',
      }, this.$ConfigCache.CacheConfig.cacheData[viewPageCode]),

      callbackObj: {
        onRowDbClick: (row, column, event) => {
          this.sendCode(row)
        }
      }

    }
  },

  methods: {
    sendCode(row) {
      // 获取嵌套组件的选中的值
      this.$emit('save', row)
      this.closeEdit()
    },

    // 关闭弹窗
    closeEdit(type) {
      this.$emit('close', type)
    }
  }
}
</script>
